<div class="box">
  <div class="box-header">
      
    <div class="row">
        <div class="col-sm-6">
            <ob_link><a class="btn" href="{:url('categoryAdd', array('parent_id' => $parent_id))}"><i class="fa fa-plus"></i> 新 增</a></ob_link>
            
            {if condition="$parent_id > 0"}
                {if condition="$current_category"}
                    <a class="btn btn-default" href="{:url('categorylist', array('parent_id' => $current_category.parent_id))}">
                        <i class="fa fa-arrow-left"></i> 返回上级
                    </a>
                {else/}
                    <a class="btn btn-default" href="{:url('categorylist')}">
                        <i class="fa fa-arrow-left"></i> 返回顶级
                    </a>
                {/if}
            {/if}
        </div>
        
        <div class="col-sm-6">
            <div class="box-tools search-form pull-right">
                <div class="input-group input-group-sm">
                    
                    <input type="text" name="search_data" style="width: 200px;" class="form-control pull-right" value="{$search.search_data|default=''}" placeholder="支持分类名称">
                    
                    <!-- <select name="status" class="form-control" style="width: 100px;">
                        <option value="">全部状态</option>
                        <option value="1" {if condition="($search.status ?? '') == '1'"}selected{/if}>启用</option>
                        <option value="0" {if condition="($search.status ?? '') == '0'"}selected{/if}>禁用</option>
                    </select> -->

                    <div class="input-group-btn">
                      <button type="button" id="search"  url="{:url('categorylist')}" class="btn btn-info btn-flat"><i class="fa fa-search"></i></button>
                    </div>

                </div>
           </div>
        </div>
    </div>
    
    {if condition="$current_category"}
        <div class="alert alert-info">
            <i class="fa fa-info-circle"></i> 当前位置：{$current_category.path_string|default=''}
        </div>
    {/if}

  </div>
    
    
  <div class="box-body table-responsive">
    <table  class="table table-bordered table-hover table-striped">
      <thead>
      <tr>
          <th class="checkbox-select-all">
              <label>
                <input class="flat-grey js-checkbox-all" type="checkbox">
              </label>
          </th>
          <th>分类名称</th>
          <th width="80">排序</th>
          <th width="150">创建时间</th>
          <th class="status-th">状态</th>
          <th>操作</th>
      </tr>
      </thead>
      
      {notempty name='list.data'}
        <tbody>
            {volist name='list.data' id='vo'}
                <tr>
                  <td>
                    <label>
                        <input class="flat-grey" type="checkbox" name="ids" value="{$vo.id}">
                    </label>
                  </td>
                  <td>
                      {if condition="isset($vo.prefix)"}
                          <span style="color: #ccc;">{$vo.prefix|raw}</span>
                      {/if}
                      <ob_link><a class="btn-frameless" href="{:url('categorylist', array('parent_id' => $vo['id']))}">{$vo.name}</a></ob_link>
                      {if condition="$vo.children_count > 0"}
                          <span class="badge bg-blue">{$vo.children_count}</span>
                      {/if}
                  </td>
                  <td>
                      <input type="text" class="form-control input-sm sort-input" 
                             value="{$vo.sort}" 
                             data-id="{$vo.id}" 
                             style="width: 60px; display: inline-block;">
                  </td>
                  <td>{$vo.create_time_text}</td>
                  <td><ob_link><a class="ajax-get" href="{:url('categoryStatus', array('id' => $vo['id'], 'status' => (int)!$vo['status']))}">{$vo.status_text|raw}</a></ob_link></td>
                  <td class="col-md-3 text-center">
                      <!-- <a href="{:url('categorylist', array('parent_id' => $vo['id']))}" class="btn"><i class="fa fa-reorder"></i> 子分类</a>
                      &nbsp; -->
                      <ob_link><a href="{:url('categoryEdit', array('id' => $vo['id']))}" class="btn "><i class="fa fa-edit"></i> 编辑</a></ob_link>
                      &nbsp;
                      {if condition="$vo.can_delete"}
                          <ob_link><a class="btn confirm ajax-get" href="{:url('categorydelete', array('id' => $vo['id']))}"><i class="fa fa-trash-o"></i> 删 除</a></ob_link>
                      {else/}
                          <span class="btn btn-default disabled" title="该分类下有子分类或商品，无法删除"><i class="fa fa-trash-o"></i> 删 除</span>
                      {/if}
                  </td>
                </tr>
            {/volist}
        </tbody>
        {else/}
        <tbody><tr class="odd"><td colspan="7" class="text-center" valign="top">{:e(config_value('empty_list_describe', 'Oh! 暂时还没有数据~'))}</td></tr></tbody>
      {/notempty}
    </table>
      
    {include file="layout/batch_btn_group"/}
  </div>
  <div class="box-footer clearfix text-center">
      {if condition="isset($list.total)"}
          <span class="text-muted">共 {$list.total} 条记录</span>
      {/if}
  </div>
</div>

<style>
.table tr[data-level="0"] {
    font-weight: bold;
}

.table tr[data-level="1"] td {
    background-color: #f9f9f9;
}

.table tr[data-level="2"] td {
    background-color: #f5f5f5;
}

.sort-input {
    text-align: center;
}

.category-tree {
    list-style: none;
    padding-left: 0;
}

.category-tree li {
    margin: 5px 0;
}

.category-tree .children {
    margin-left: 20px;
    border-left: 1px dashed #ddd;
    padding-left: 15px;
}
</style>

<script>
$(function() {
    // 排序输入框失焦事件
    $('.sort-input').blur(function() {
        var id = $(this).data('id');
        var sort = $(this).val();
        
        if (sort === '' || isNaN(sort)) {
            layer.msg('排序值必须为数字');
            return;
        }
        
        $.post('{:url("setSort")}', {
            id: id,
            sort: sort
        }, function(res) {
            if (res.code !== 1) {
                layer.msg(res.msg || '排序设置失败');
            }
        });
    });
    
    // 搜索功能
    $('#search').click(function() {
        var search_data = $('input[name="search_data"]').val();
        var status = $('select[name="status"]').val();
        var url = $(this).attr('url');
        
        var params = [];
        if (search_data) params.push('search_data=' + encodeURIComponent(search_data));
        if (status !== '') params.push('status=' + status);
        
        // 保持当前parent_id
        var parentId = '{$parent_id}';
        if (parentId) params.push('parent_id=' + parentId);
        
        if (params.length > 0) {
            url += '?' + params.join('&');
        }
        
        window.location.href = url;
    });
    
    // 回车搜索
    $('input[name="search_data"]').keypress(function(e) {
        if (e.which === 13) {
            $('#search').click();
        }
    });
});
</script>